import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class ConfirmRun extends StatefulWidget {
  @override
  ConfirmRunState createState() => new ConfirmRunState();
}

void main() {
  runApp(MaterialApp(
    home: ConfirmRun(),
    routes: {},
  ));
}

bool HaveTx = false;
String ImgUrl = '';
String showText = "hide";
bool isOff = true;
int count = 0;

class ConfirmRunState extends State<ConfirmRun> {
  bool HaveTX = false;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
            backgroundColor: Color.fromRGBO(51, 51, 51, 1),
            titleSpacing: 0.0,
            title: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                FlatButton(
                  materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                  child: Row(
                    children: <Widget>[
                      Icon(
                        Icons.arrow_back_ios,
                        color: Colors.white,
                      ),
                      Text(
                        '返回',
                        style: TextStyle(color: Colors.white, fontSize: 16),
                      )
                    ],
                  ),
                  onPressed: () {},
                ),
                Container(
                  child: Row(
                    children: [
                      Text(
                        '抢单待确认详情',
                        style: TextStyle(
                          fontSize: 16,
                          color: Colors.white,
                        ),
                      ),
                      SizedBox(
                        width: 25,
                      )
                    ],
                  ),
                ),
                IconButton(
                    icon: Icon(Icons.more_horiz),
                    color: Colors.white,
                    onPressed: () {})
              ],
            )),
        body: Column(
          children: <Widget>[
            Offstage(
              offstage: isOff,
              child: Cancel(),
            ),
            Container(
              color: Colors.white,
              child: Column(
                children: <Widget>[
                  Container(
                    margin: EdgeInsets.only(
                      left: 20,
                      right: 20,
                      top: 10,
                    ),
                    color: Colors.white,
                    child: Column(
                      children: <Widget>[
                        Column(
                          children: <Widget>[
                            Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: <Widget>[
                                Text(
                                  "跑腿",
                                  style: TextStyle(fontSize: 10),
                                ),
                                Text(
                                  "待确认",
                                  style: TextStyle(
                                      fontSize: 15, color: Colors.red),
                                ),
                              ],
                            ),
                            SizedBox(
                              height: 10,
                            ),
                            Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: <Widget>[
                                Text(
                                  "任务主题（限制20字）",
                                  style: TextStyle(fontSize: 20),
                                ),
                                SizedBox(
                                  height: 10,
                                ),
                                Container(
                                  child: Row(
                                    mainAxisAlignment: MainAxisAlignment.start,
                                    children: <Widget>[
                                      Container(
                                        child: Row(
                                          mainAxisAlignment:
                                          MainAxisAlignment.spaceEvenly,
                                          children: <Widget>[
                                            Container(
                                              decoration: BoxDecoration(
                                                border: Border.all(
                                                    width: 1,
                                                    color: Colors.grey),
                                                borderRadius:
                                                BorderRadius.circular(75),
                                              ),
                                              width: 40,
                                              height: 40,
                                              child: Tx(),
                                            ), //头像
                                            SizedBox(
                                              width: 10,
                                            ),
                                            Column(
                                              crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                              children: <Widget>[
                                                Text("发单人姓名"),
                                                Text("厦门大学"),
                                              ],
                                            ),
                                          ],
                                        ), //头像,
                                      ),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ],
                        ), //first
                        SizedBox(
                          height: 10,
                        ),
                        Divider(
                          color: Colors.grey,
                        ),
                        Column(
                          children: <Widget>[
                            Row(
                              mainAxisAlignment: MainAxisAlignment.start,
                              children: <Widget>[
                                Icon(
                                  Icons.attach_money,
                                  color: Colors.grey,
                                ),
                                SizedBox(
                                  width: 10,
                                ),
                                Text(
                                  "跑腿费：4元",
                                  style: TextStyle(
                                    fontSize: 15,
                                  ),
                                ),
                              ],
                            ),
                            // SizedBox(
                            //   height: 10,
                            // ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.start,
                              children: <Widget>[
                                Icon(
                                  Icons.email,
                                  color: Colors.grey,
                                ),
                                SizedBox(
                                  width: 10,
                                ),
                                Expanded(
                                  child: Padding(
                                    padding: EdgeInsets.only(
                                      top: 13,
                                    ),
                                    child: Text(
                                      "任务内容任务内容任务内容任务内容任务内容任务内容任务内容任务内容任务内容任务内容任务内容",
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ],
                        ),
                        SizedBox(
                          height: 10,
                        ),
                        Row(
                          mainAxisAlignment:MainAxisAlignment.start,
                          children: <Widget>[
                            Icon(Icons.access_time,color: Colors.grey,),
                            SizedBox(
                              width: 10,
                            ),
                            Text("预计开始时间：2020/11/12  18:00"),
                          ],
                        ),
                        SizedBox(
                          height: 10,
                        ),
                        Row(
                          mainAxisAlignment:MainAxisAlignment.start,
                          children:<Widget> [
                            Container(
                              margin: EdgeInsets.only(left: 33),
                              child: Text("预计结束时间：2020/11/12  20:00"),
                            ),
                          ],
                        ),
                        SizedBox(
                          height: 10,
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: <Widget>[
                            Icon(
                              Icons.location_on,
                              color: Colors.grey,
                            ),
                            SizedBox(
                              width: 10,
                            ),
                            Text(
                              "福建省厦门市（发单人收货地址）",
                              style: TextStyle(
                                fontSize: 15,
                              ),
                            ),
                          ],
                        ),
                        SizedBox(
                          height: 5,
                        ),
                        Divider(
                          color: Colors.grey,
                        ),
                        Column(
                          children: <Widget>[
                            Row(
                              children: <Widget>[
                                Icon(
                                  Icons.phone_android,
                                  color: Colors.grey,
                                ),
                                SizedBox(
                                  width: 10,
                                ),
                                Text("15688888888"),
                              ],
                            ),
                            SizedBox(
                              height: 20,
                            ),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Icon(
                                  Icons.phone,
                                  color: Colors.grey,
                                ),
                                SizedBox(
                                  width: 10,
                                ),
                                Text("电话发单人"),
                              ],
                            ),
                          ],
                        ), //third
                        SizedBox(
                          height: 5,
                        ),
                        Divider(
                          color: Colors.grey,
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: <Widget>[
                            Icon(
                              Icons.access_time,
                              color: Colors.grey,
                            ),
                            SizedBox(
                              width: 10,
                            ),
                            Text("发单时间：2020/11/12  18:00"),
                          ],
                        ),
                        SizedBox(
                          height: 10,
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: <Widget>[
                            Container(
                              margin: EdgeInsets.only(left: 33),
                              child: Text("接单时间：2020/11/12  20:00"),
                            ),
                          ],
                        ),
                        Divider(
                          color: Colors.grey,
                        ),
                        Container(
                          margin: EdgeInsets.only(left: 33, bottom: 10),
                          child: Row(
                            children: <Widget>[
                              Text("接单人姓名"),
                              SizedBox(
                                width:25,
                              ),
                              Text("15688888888"),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
            Spacer(),
            Container(
              child: Container(
                margin: EdgeInsets.only(left: 10, right: 10),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    FlatButton(
                      color: Colors.grey,
                      colorBrightness: Brightness.dark,
                      splashColor: Colors.grey,
                      child: Text("申诉"),
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(10.0),
                      ),
                      onPressed: () {
                        showDialog(
                            context: context,
                            barrierDismissible: false,
                            builder: (context) {
                              return AppealDialog();
                            });
                      },
                    ),
                    Container(
                      child: Row(
                        children: <Widget>[
                          FlatButton(
                            color: Colors.grey,
                            colorBrightness: Brightness.dark,
                            splashColor: Colors.grey,
                            child: Text("取消订单"),
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(10.0),
                            ),
                            onPressed: () {
                              showDialog(
                                  context: context,
                                  barrierDismissible: false,
                                  builder: (context) {
                                    return CancelDialog();
                                  });
                            },
                          ),
                          SizedBox(
                            width: 15,
                          ),
                          FlatButton(
                            color: Colors.grey,
                            colorBrightness: Brightness.dark,
                            splashColor: Colors.grey,
                            child: Text("开始任务"),
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(10.0),
                            ),
                            onPressed: () {
                              setState(() {
                                isOff = !isOff;
                                // count++;
                                // if (count % 2 == 0) {
                                //   count++;
                                //   print(count);
                                //   return Cancel();
                                // }
                              });
                              if (isOff) {
                                showText = "show";
                              } else {
                                showText = "hide";
                              }
                              showDialog(
                                  context: context,
                                  barrierDismissible: false,
                                  builder: (context) {
                                    return TaskDialog();
                                  });
                            },
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
  }

  @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
  }

  @override
  void didUpdateWidget(ConfirmRun oldWidget) {
    // TODO: implement didUpdateWidget
    super.didUpdateWidget(oldWidget);
  }

  @override
  void didChangeDependencies() {
    // TODO: implement didChangeDependencies
    super.didChangeDependencies();
  }
}

class AppealDialog extends StatefulWidget {
  @override
  AppealDialogState createState() => new AppealDialogState();
}

class AppealDialogState extends State<AppealDialog> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Center(
        child: Container(
          padding: EdgeInsets.all(5),
          alignment: Alignment.center,
          decoration: BoxDecoration(
              shape: BoxShape.rectangle,
              boxShadow: [
                BoxShadow(
                    offset: Offset(8.0, 8.0),
                    color: Colors.black.withOpacity(0.75),
                    blurRadius: 15.0,
                    spreadRadius: 2.0),
              ],
              color: Colors.white,
              border: Border(
                top: BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
                bottom:
                BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
                left: BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
                right:
                BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
              )),
          width: MediaQuery.of(context).size.width*0.6,
          height: 150,
          child: Column(
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: [
                  GestureDetector(
                      onTap: () {},
                      child: GestureDetector(
                        onTap: () {
                          Navigator.of(context, rootNavigator: true).pop(1);
                        },
                        child: Container(
                          child: Icon(
                            Icons.close,
                            size: 20,
                          ),
                        ),
                      ))
                ],
              ),
              Container(
                padding: EdgeInsets.only(left: 35, right: 35, top: 20, bottom: 20),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Container(
                      child: Text(
                        '如果出现争议，请拨打下方客服电话进行申诉',
                        style: TextStyle(
                            color: Colors.black,
                            fontSize: 12,
                            decoration: TextDecoration.none,
                            fontWeight: FontWeight.w500),
                      ),
                      margin: EdgeInsets.only(bottom: 20),
                    ),
                    Container(
                      child: Text(
                        '客服电话：0592-5888888',
                        style: TextStyle(
                            color: Colors.blue,
                            fontSize: 13,
                            decoration: TextDecoration.none,
                            fontWeight: FontWeight.w500),
                      ),
                    )
                  ],
                ),
              )
            ],
          ),
        ));
  }
}

class CancelDialog extends StatefulWidget {
  @override
  CancelDialogState createState() => new CancelDialogState();
}

class CancelDialogState extends State<CancelDialog> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Center(
        child: Container(
          padding: EdgeInsets.all(5),
          alignment: Alignment.center,
          decoration: BoxDecoration(
              shape: BoxShape.rectangle,
              boxShadow: [
                BoxShadow(
                    offset: Offset(8.0, 8.0),
                    color: Colors.black.withOpacity(0.75),
                    blurRadius: 15.0,
                    spreadRadius: 2.0),
              ],
              color: Colors.white,
              border: Border(
                top: BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
                bottom:
                BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
                left: BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
                right:
                BorderSide(width: 0.5, color: Colors.black.withOpacity(0.75)),
              )),
          width:MediaQuery.of(context).size.width*0.6,
          height: 150,
          child: Column(
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.end,
                children: [
                  GestureDetector(
                      onTap: () {},
                      child: GestureDetector(
                        onTap: () {
                          Navigator.of(context, rootNavigator: true).pop(1);
                        },
                        child: Container(
                          child: Icon(
                            Icons.close,
                            size: 20,
                          ),
                        ),
                      ))
                ],
              ),
              Container(
                padding: EdgeInsets.only(left: 35, right: 35, top: 20, bottom: 20),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Container(
                      child: Text(
                        '不能私下取消跑单哦，如确有需要，请联系客服跑腿！',
                        style: TextStyle(
                            color: Colors.black,
                            fontSize: 12,
                            decoration: TextDecoration.none,
                            fontWeight: FontWeight.w500),
                      ),
                      margin: EdgeInsets.only(bottom: 20),
                    ),
                    Container(
                      child: Text(
                        '客服电话：0592-5888888',
                        style: TextStyle(
                            color: Colors.blue,
                            fontSize: 13,
                            decoration: TextDecoration.none,
                            fontWeight: FontWeight.w500),
                      ),
                    )
                  ],
                ),
              )
            ],
          ),
        ));
  }
}

class TaskDialog extends StatefulWidget {
  @override
  TaskDialogState createState() => new TaskDialogState();
}

class TaskDialogState extends State<TaskDialog> {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Material(
      //创建透明层
      type: MaterialType.transparency, //透明类型
      child: new Center(
        //保证控件居中效果
        child: new SizedBox(
          width: MediaQuery.of(context).size.width*0.6,
          height: 200.0,
          child: Container(
            decoration: BoxDecoration(
                border: new Border.all(color: Colors.black, width: 0.5),
                color: Colors.white),
            child: Column(
              children: <Widget>[
                SizedBox(height: 10,),
                Text("确认提示",style: TextStyle(fontSize: 20),),
                SizedBox(height: 30,),
                Center(
                  child:Text("开始任务后需尽快完成任务，确认开始任务吗？",style:TextStyle(color: Colors.black,fontSize: 16,decoration: TextDecoration.none,fontWeight: FontWeight.w500),),
                ),
                Spacer(),
                Row(
                  children: <Widget>[
                    Expanded(
                      child: Container(
                        child: Center(
                          child: FlatButton(
                            highlightColor:Color.fromRGBO(255,255,255,0),
                            child: Text("确认"),
                            onPressed: (){

                            },
                          ),
                        ),
                        decoration: BoxDecoration(
                          border: new Border.all(color: Colors.black, width: 0.5),
                        ),
                      ),
                    )
                    ,
                    Expanded(
                      child: Container(
                        child: Center(
                          child: FlatButton(
                            highlightColor:Color.fromRGBO(255,255,255,0),
                            child: Text("取消"),
                            onPressed: (){
                              Navigator.pop(context);
                            },
                          ),
                        ),
                        decoration: BoxDecoration(
                          border: new Border.all(color: Colors.black, width: 0.5),
                        ),
                      ),
                    )
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

Tx() {
  if (HaveTx == false) {
    return Center(
      child: Text(
        '头像',
        textAlign: TextAlign.center,
      ),
    );
  } else {
    return Image.asset(
      ImgUrl,
      fit: BoxFit.fill,
    );
  }
}

Cancel() {
  if (isOff == false ) {
    return Column(
      children: <Widget>[
        Container(
          alignment: Alignment.topLeft,
          color: Colors.white,
          padding: EdgeInsets.all(10),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text(
                "任务已开始",
                style: TextStyle(fontSize: 16),
              ),
              Text("开始时间：2020/12/8  21:00")
            ],
          ),
        ),
        SizedBox(
          height: 20,
        ),
      ],
    );
  } else if(isOff == true){
    return Column(
      children: <Widget>[
        Container(
          alignment: Alignment.topLeft,
          color: Colors.white,
          padding: EdgeInsets.all(10),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text(
                "任务已完成",
                style: TextStyle(fontSize: 16),
              ),
              Text("完成时间：2020/12/8  21:00")
            ],
          ),
        ),
        SizedBox(
          height: 20,
        ),
      ],
    );;
  }
}
